@extends('dashboard.includes.master')
@section('css')
@endsection
@section('title')
Add New Contacts
@endsection

@section('content')
<div class="container">
    <h2 class="mb-4">الإرسال بالجملة</h2>

    <form action="{{ route('whatsapp.send') }}" method="POST" enctype="multipart/form-data">
        @csrf

        <!-- Select Groups -->
        <div class="mb-3">
            <label for="groups" class="form-label">اختر مجموعات الجهات</label>
            <select name="groups[]" id="groups" class="form-select" multiple>
                @foreach($groups as $group)
                    <option value="{{ $group->id }}">{{ $group->name }}</option>
                @endforeach
            </select>
        </div>

        <!-- Campaign Name -->
        <div class="mb-3">
            <label for="campaign_name" class="form-label">اسم الحملة</label>
            <input type="text" name="campaign_name" id="campaign_name" class="form-control" required>
        </div>

        <!-- Sender Name -->
        <div class="mb-3">
            <label for="sender" class="form-label">اسم المرسل</label>
            <select name="sender" id="sender" class="form-select" required>
                @foreach($senders as $sender)
                    <option value="{{ $sender->id }}">{{ $sender->name }}</option>
                @endforeach
            </select>
        </div>

        <!-- Caption -->
        <div class="mb-3">
            <label for="caption" class="form-label">عنوان رئيسي</label>
            <input type="text" name="caption" id="caption" class="form-control">
        </div>

        <!-- Media Upload -->
        <div class="mb-3">
            <label for="media" class="form-label">تحميل صورة أو فيديو</label>
            <input type="file" name="media" id="media" class="form-control" accept="image/*,video/*">
        </div>

        <!-- Message Content -->
        <div class="mb-3">
            <label for="message" class="form-label">نص الرسالة</label>
            <textarea name="message" id="message" class="form-control" rows="6" required></textarea>
        </div>

        <!-- Submit Button -->
        <button type="submit" class="btn btn-primary">إرسال الرسائل</button>
    </form>
</div>
@endsection
